<template>
	<transition name="slide-down">
		<div class="msg-box" v-if="msg">{{msg}}</div>
	</transition>
	<component :is="componentName"></component>
</template>

<script>
let fs = window.require('fs')
import { getCurrentInstance } from 'vue'
import setting from './components/setting.vue'
import index from './components/index.vue'

export default {
	data () {
		return {
			msg: '',
			timeId: -1,
			pathExist: false,
			path: '',
			last: ''
		}
	},
	created () {
		try {
			let config = fs.readFileSync('config.dll', 'utf-8').split('\n')
			
			if (config[0].indexOf("path=") != -1) {
				this.path = config[0].split('=')[1]
				this.pathExist = true
			}
			
			if (config[1]) {
				this.last = config[1].split('=')[1]
			}
		} catch (e) {
			console.log(e)
		}
		getCurrentInstance().appContext.config.globalProperties.$main = this
	},
	computed: {
		componentName () {
			return this.pathExist ? 'index' : 'setting'
		}
	},
	methods: {
		// 提示消息
		showMsg (msg, fn) {
			clearTimeout(this.timeId)
			this.msg = msg
			this.timeId = setTimeout(() => {
				this.msg = ''
				if (fn) {
					fn()
				}
			}, 2000)
		},
		// 写配置文件
		writeConfig () {
			let config = 'path=' + this.path
			if (this.last) {
				config = config + '\n' + 'last=' + this.last
			}
			fs.writeFile('./config.dll', config, (err) => {
				if (err) {
					console.log(err)
				}
			})
		}
	},
	components: {
		setting,
		index
	}
}
</script>

<style lang="less">
*{
	box-sizing: border-box;
	padding: 0;
	margin: 0;
}

div, span{
	user-select: none;
}

#app {
	position: relative;
	width: 100vw;
	height: 100vh;
	
	.slide-down-enter-from, .slide-down-leave-to{
		transform: translateY(-100%);
	}
	
	.slide-down-enter-to, .slide-down-leave-from{
		transform: translateY(0);
	}
	
	.msg-box{
		z-index: 50;
		width: 100vw;
		background: #FF4400;
		color: #FFFFFF;
		padding: 5px 0;
		text-align: center;
		position: absolute;
		top: 0;
		transition: all .2s;
	}
}
</style>
